<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>申请状态</title>
    <!--    layui-->
    <link rel="stylesheet" href="../layui-v2.6.5/layui/css/layui.css">
    <script src="../layui-v2.6.5/layui/layui.js"></script>
    <!--    自己的js-->
    <script src="../jquery/jquery-1.12.4.js"></script>
    <script src="js/drug.js" type="text/javascript"></script>

    <!--    弹出层-->
    <link rel="stylesheet" href="../layer/theme/default/layer.css">
    <script src="../layer/layer.js"></script>

    <!--    自己的样式-->
    <link rel="stylesheet" href="css/drug.css">
</head>
<body>
<!--                查看申请状态-->
<div>
    <!--                    条件查询-->
    <div class="layui-form">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">查询时间</label>
                <div class="layui-input-inline" style="width: 160px;">
                    <select id="time">
                        <option value="0">查询全部</option>
                        <option value="1">最近一周</option>
                        <option value="2">最近一月</option>
                        <option value="3">最近一年</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">申请类型</label>
                <div class="layui-input-inline" style="width: 160px;">
                    <select id="type">
                        <option value="0">查询全部</option>
                        <option value="1">补充库存</option>
                        <option value="2">增加新药</option>
                    </select>
                </div>
            </div>
        </div>
    </div>

    <table id="demo" lay-filter="show">

    </table>

</div>
</body>
<script>
    //加载表格
    layui.use('table', function () {
        let table = layui.table;
        //加载实例
        table.render({
            elem: "#demo",        //指定元素
            id: "demo",            //表标识
            toolbar: "#toolbarDemo",  //表头工具栏
            height: 300,            //宽度
            url: "http://localhost:8080/com/initServlet?opr=applyInit",              //数据接口
            method: "get",       //添加类型
            page: true,           //开启分页
            limit: 10,            //每页显示的条数
            cols: [[              //表头
                {field: 'id', title: '编号', width: 100, sort: true, fixed: 'left'}
                , {field: 'name', title: '申请人', width: 100}
                , {
                    field: 'date', title: '申请时间', width: 160, sort: true, templet(d) {
                        return layui.util.toDateString(d.date, "yyyy-MM-dd HH:mm:ss")
                    }
                }
                , {field: 'type', title: '申请类型', width: 100}
                , {
                    field: 'applyStatus', title: '申请状态', width: 100, templet: function (d) {
                        return d.applyStatus === 0 ? "<span style='color: #e72727'>审核未通过</span>" : "<span style='color: #35f535'>审核通过</span>"
                    }
                }
                , {
                    field: 'drugSpecies', title: '库存药品数量', width: 120, templet(d) {
                        return d.drugSpecies === 0 ? "" : d.drugSpecies
                    }
                }
                , {field: 'applyDrug', title: '新增药品名称', width: 120}
                , {
                    field: 'drugType', title: '新增药品类型', width: 120, templet: function (d) {
                        if (d.drugType === 0) {
                            return '';
                        }
                        return d.drugType === 1 ? '中药' : '西药'
                    }
                }
                , {field: 'price', title: '新增药品单价', width: 140, sort: true}
                , {field: 'count', title: '药品数量', width: 120, sort: true}
                , {field: 'remark', title: '备注', width: 160}
                , {field: 'tool', title: '操作', width: 180, toolbar: "#barDemo2", fixed: 'right'}    //行工具栏
            ]],
            //默认文本
            text: {
                none: '暂无数据'
            },
            //条件
            where: {
                date: '0',     //用户选择时间
                type: '0'      //用户的操作类型
            }
        })
        //监听事件  其中 show 参数为标识  lay-filter="show"
        table.on('toolbar(show)', function (obj) {
            //拿到当前的容器  拿到id即拿到该容器  通过id就可以做很多事情  例如返回当前被选择的数据
            let demo = table.checkStatus(obj.config.id);
            // obj.event 可以拿到当前的事件名
            let date = $("#time").val();     //用户选择
            let type = $("#type").val();     //申请类型
            switch (obj.event) {
                case 'sel':
                    table.reload('demo', {
                        page: {
                            curr: 1    //起始页
                        },
                        where: {       //传递的参数
                            date: date,   //用户选择的查询时间端
                            type: type    //申请类型
                        }
                    })
                    break;
                case 'upd':
                    table.reload('demo', {
                        where: {          //传递的参数
                            date: date,   //用户选择的查询时间端
                            type: type    //申请类型
                        }
                    })
                    break;
            }
        });

        let flag = false;    //标记
        //行工具条
        table.on('tool(show)', function (obj) {
            let choo = obj.event;    //拿到事件名
            if (flag) {
                return;
            }
            flag = true;
            switch (choo) {
                case 'add':
                    if (obj.data.applyStatus !== 1) {
                        layer.msg("只有申请通过才能入库")
                        flag = !flag;
                        return;
                    }
                    $.ajax({
                        url: "http://localhost:8080/com/drugServlettt",
                        type: "post",
                        data: {
                            opr: 'drugManage',
                            id: obj.data.id,
                            name: obj.data.name,
                            dates: obj.data.date,
                            drugName: obj.data.applyDrug,
                            drugType: obj.data.drugType,
                            price: obj.data.price,
                            count: obj.data.count,
                            types: obj.data.type,
                            remark: obj.data.remark
                        },
                        dataType: "json",
                        success: function (data) {
                            if (data === 0) {
                                layer.msg("添加库存失败")
                            } else if (data === 1) {
                                layer.msg("添加库存成功")
                            } else if (data === 2) {
                                layer.msg("新增药品成功")
                            }
                            let date = $("#time").val();     //用户选择
                            let type = $("#type").val();     //申请类型
                            //刷新
                            table.reload('demo', {
                                where: {          //传递的参数
                                    date: date,   //用户选择的查询时间端
                                    type: type    //申请类型
                                }
                            });
                            flag = !flag;
                        }
                    });
                    break;
                case 'edit':
                    if (obj.data.type === "新增药品") {
                        flag = !flag;
                        return;
                    }
                    $.ajax({
                        url: "http://localhost:8080/com/initServlet",
                        type: "post",
                        data: {
                            opr: 'selStork',
                            date: obj.data.date
                        },
                        dataType: "json",
                        success: function (data) {
                            let lis = ``;
                            let zj = 0;
                            for (let i = 0; i < data.length; i++) {
                                let money = parseInt(data[i].price) * parseInt(data[i].count);
                                zj += money;
                                lis += `<li class="liui2">
                                           <span class="span2">${data[i].drugName}</span>
                                           <span class="span2">${data[i].price}</span>
                                           <span class="span2">${data[i].count}</span>
                                           <span class="span2">${money}</span>
                                        </li>`;
                            }
                            let div = `<div>
                                         <ul>
                                           <li class="liui">
                                             <span class="span">药品名称</span>
                                             <span class="span">药品价格</span>
                                             <span class="span">药品数量</span>
                                             <span class="span">金额小计</span>
                                           </li>
                                           ${lis}
                                           <li class="liui">
                                             <span class="span"></span>
                                             <span class="span"></span>
                                             <span class="span">药品总价</span>
                                             <span class="span">${zj}</span>
                                           </li>
                                         </ul>
                                       </div>`;
                            layer.open({
                                id: "one",    //设定id
                                title: "<span class='test'>库存药品名单</span>",   //标题
                                type: 1,                  //弹出层类型
                                content: div,             //弹出内容
                                skin: 'test',             //皮肤
                                area: 'auto',             //宽高
                                offset: ['150px', '500px'],     //X轴 Y轴
                                btn: ['关闭全部'],         //关闭按钮
                                bthAlign: 'c',            //关闭按钮位置
                                closeBth: 1,              //关闭按钮样式
                                shade: 0                  //外阴影
                            })
                            flag = !flag;
                        }
                    })
                    break;
                case 'del':
                    layer.msg('没有权限')
                    flag = !flag
                    break;
            }
        })
    })
</script>
</html>